<template>
	<view class="recharge">
		<view class="recharge-list">
			<view class="main" v-for="(item,index) in list" :key="index">
				<view class="main-list">
					<view class="left">{{$t('账号')}}</view>
					<view class="right">{{item.nickname}}</view>
				</view>
				<view class="main-list">
					<view class="left">{{$t('总投资')}}</view>
					<view class="right">{{item.money}} USDT</view>
				</view>
				<view class="main-list">
					<view class="left">{{$t('创建时间')}}</view>
					<view class="right">{{item.create_time_text}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				page:1,
				isDone:false,
				list:[],
			}
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title: this.$t("团队业绩")
			})
			this.getList();
		},
		onPullDownRefresh() {
			this.page = 1;
			this.isDone = true;
			this.getList();
		},
		onReachBottom() {
			if(!this.isDone){
				this.page += 1;
				this.getList();
			}
			
		},
		methods: {
			getList(){
				uni.$ice.post('order/team_list?page='+this.page, {}, false).then(res => {
					if(this.page == 1){
						this.list = res.data
						uni.stopPullDownRefresh()
					}else{
						this.list = this.list.concat(res.data);
						if(res.data.length == 0){
							this.isDone = true;
						}
					}
					
					
							
				}).catch(err => {
							
				})
			}
		}
	}
</script>

<style scoped>
	
	.recharge{
		padding-top: 40rpx;
		background-color: #080647;
		padding-bottom: 40rpx
	}

	.recharge .title{
		color: #fff;
		width: 91%;
		box-sizing: border-box;
		margin: 0 auto;
		font-size: 42rpx;
		font-weight: 700;
		padding: 32rpx 0;
		text-align: center
	}

	.recharge .main{
		width: 91%;
		box-sizing: border-box;
		box-shadow: -1px 0 3px #6c4eed, 0 -1px 2px #69bbf5, 1px 0 3px #f56971;
		border-radius: 32rpx;
		margin: 0 auto;
		padding: 28rpx 36rpx 32rpx 38rpx;
		margin-bottom: 36rpx;
		font-size:24rpx;
	}

	.recharge .main .main-list{
		display: flex;
		justify-content: space-between;
		color: #fff;
		padding: 24rpx 0;
		border-bottom: 1px solid hsla(0, 0%, 100%, .1)
	}

	.recharge .main .percent{
		display: block
	}

	.recharge .main .percent .line{
		margin-top: 14rpx;
		width: 100%;
		box-sizing: border-box;
		height: 12pt;
		border-radius: 16rpx;
		opacity: 1;
		background-color: #1f1c68
	}

	.recharge .main .percent .line .line-img{
		width: 30%;
		height: 100%;
		box-sizing: border-box;
		background-image: linear-gradient(145deg, #5328f9, #c825fc);
		border-radius: 16rpx
	}

	.recharge .main .btn{
		background-image: url();
		background-repeat: no-repeat;
		background-size: 100% 100%;
		padding: 18rpx 0;
		text-align: center;
		margin-top: 94rpx;
		box-sizing: border-box;
		color: #fff
	}
</style>